<html>
<head>
<link href="../../style/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<p class="heading">
Gl_MenuBar Object (part of the WidgetManager module)
</p>
<p class="subheading">
Description:
</p>
<p>
The Gl_MenuBar object is a container for drop-down menus. This object can be attached to
<a href="gl_windowdoc.html">Gl_Window</a> objects or the desktop (by desktop, I'm referring
to the browser canvas here). MenuBars are actually collections of menus and menuItems. These
are all separate object types, but since they're always used together, I'll describe them
all here.
</p>

<p class="subheading">
To use:
</p>

<p class="jcode">
&lt;script language="Javascript" src="gamelib_widgets.js"&gt;&lt;/script&gt;
</p>

<p>
Here's an example of the creation of a menuBar object with one menu, which itself has a
submenu.
</p>

<p class="jcode">
	var myMenuBar=new Gl_MenuBar(500);<br />
	var myMenu=new Gl_Menu('File','#bbbbbb','#ffffff');<br />
&nbsp; &nbsp; myMenu.addItem('Search','widgetManager.searchWindow()',null,'search.gif');<br />
&nbsp; &nbsp; myMenu.addItem('Print','widgetManager.doWindowPrint()',null,'print.gif');<br />
<br />
	var mySubMenu=new Gl_Menu('Options','#bbbbbb','#ffffff');<br />
&nbsp; &nbsp; mySubMenu.addItem('Option 1','doSomething()',null,null);<br />
&nbsp; &nbsp; mySubMenu.addItem('Option 2','doSomethingElse()',null,null);<br />
<br />
&nbsp; &nbsp; myMenu.addMenu(mySubMenu);<br />
&nbsp; &nbsp; myMenu.addItem('Exit','widgetManager.destroyWindow()',null,'fileexit.gif');<br />
<br />
	myMenuBar.addMenu(myMenu);

</p>

<p>
So basically, you can only add Menus to MenuBars, but you can add both Menus and MenuItems
to Menus. The menuItem object is by far the simplest, it has no methods and is the building
block for menus. You don't need to build the MenuItem itself, just call the addItem method
on the menu object with the following parameters:
</p>

<ul>
 <li>Text for the menu item</li>
 <li>Function to call, OR a URL to load when item is clicked.</li>
 <li>Target frame for the above function or URL.</li>
 <li>Icon image. The icon image should reside in the menu_icons subdirectory, from the
     main directory set up when the widgetManager was initialised.</li>
</ul>

<p>
The Gl_Menu objects only have private methods, but can take up to 10 initial
parameters, although only the first one is required. If a parameter is ommitted,
or set as null, then it is inherited from the parent, or the widgetManager if a
top level menu. The default values are set in the setup.html file described in
the <a href="../widgetdoc.html">Widget Module docs</a>.
</p>

<ul>
 <li>Text for menu. If this is a top-level menu, then this is the text that will appear
     in the button on the menuBar. Otherwise it's the text that will appear in its
     parent menu.</li>
 <li>Border colour.</li>
 <li>Background colour for menu items.</li>
 <li>Mouseover background colour for menu items.</li>
 <li>Font family. eg "Arial,Helvetica,sans-serif".</li>
 <li>Font size.</li>
 <li>Font colour.</li>
 <li>Mouseover font colour for menu items.</li>
 <li>Icon image (same as with menuItems).</li>
 <li>Opacity, from 0-100. 0 is totally transparent, 100 is totally opaque.</li>
</ul>

<p class="subheading">
List of public methods for Gl_MenuBar objects
</p>

<p>
<a href="#addMenu">addMenu</a><br />
<a href="#addToDesktop">addToDesktop</a><br />
<a href="#moveTo">moveTo</a><br />
</p>

<p class="subheading">
Descriptions of methods for Gl_MenuBar objects
</p>

<table>
<tr>
<th>Method</th><th NOWRAP>Parameters</th><th>Description</th>
</tr>

<tr>
<a name="addMenu"></a>
<td>addMenu</td>
<td>Gl_Menu object</td>
<td>
Adds a top level menu to this menuBar. You can add as many menus to a menubar
as you like. The spacing is handled automatically.
</td>
</tr>

<tr>
<a name="addToDesktop"></a>
<td>addToDesktop</td>
<td>none</td>
<td>
Attaches this menuBar to the desktop.
</td>
</tr>

<tr>
<a name="moveTo"></a>
<td>moveTo</td>
<td>Numeric, Numeric</td>
<td>
Move the menuBar to position x,y. This should only be used with menuBars that have been
attached to the desktop (see above).
</td>
</tr>

</table>

</body>
</html>